<!DOCTYPE html>
<html lang="en">
<head>
    <meta charset="UTF-8">
    <meta name="viewport" content="width=device-width, initial-scale=1.0">
    <title>Document</title>
    <style>
            input[type=text]{
            width: 50%;
            background-color: white;
            font-size: 16px;
            border: 1px solid #ccc;
            background-position: 10px 10px; 

        }
         table{
            width: 900px;
            margin: 0 auto;
            border-collapse: collapse;
            font-size: 15px;
         }
         tr,td,th{
            border: 3px solid black;
            text-align: left;
        }
         div{
            width:900px;
            height:353px;
            box-sizing: border-box;
            background-color: blueviolet;
            border: 1px solid black;
            margin:0% 17.5% 0% 17%;
        
         }
          
    </style>
   
</head>
<body> 
     <h1 style="margin-left: 40%;">学生课程管理系统</h1>
    <div>  
        <form onsubmit="return validate()" method="post">  
    <table>
        <tr>
            <td style="width: 300px;text-align: right;">用户选择</td>
            <td style="width: 600px">
                <label>
                    <input type="checkbox" name="用户选择" value="学生">学生
                    <input type="checkbox" name="用户选择" value="教师">教师
                    <input type="checkbox" name="用户选择" value="管理员">管理员
                </label>
            </td>
        </tr>
        <tr>
            <td style="width: 300px;text-align: right;">用户名</td>
            <td style="width: 600px;">
                <input type="text" name="用户名">
            </td>
        </tr>

        <tr>
            <td style="width: 300px;text-align: right;">密码</td>
            <td style="width: 600px;">
                <input type="password" name="password" id="pw">
            </td>
        </tr>

        <tr>
            <td style="width: 300px;text-align: right;">确认密码</td>
            <td style="width: 600px;" name="234">
                <input type="password" name="repassword" id="repw">
            </td>
        </tr>

        <tr>
            <td style="width: 300px;text-align: right;">出生日期</td>
            <td>
                <select>
                    <option value="--请选择--">--请选择--</option>
                    <option value="2000">2000</option>
                    <option value="2001">2001</option>
                    <option value="2002">2002</option>
                    <option value="2003">2003</option>
                    <option value="2004">2004</option>
                    <option value="2005">2005</option>
                    <option value="2006">2006</option>
                    <option value="2007">2007</option>
                    <option value="2008">2008</option>
                    <option value="2009">2009</option>
                    <option value="2010">2010</option>
                    <option value="2011">2011</option>
                    <option value="2012">2012</option>
                    <option value="2013">2013</option>
                    <option value="2014">2014</option>
                    <option value="2015">2015</option>
                </select>年
            </td>
        </tr>

        <tr>
            <td style="width: 300px;text-align: right;">兴趣</td>
            <td style="width: 600px">
                <label>
                    <input type="checkbox" name="用户选择" value="音乐">音乐
                    <input type="checkbox" name="用户选择" value="动漫">动漫
                    <input type="checkbox" name="用户选择" value="电影">电影
                </label>
            </td>
        </tr>
        <tr>
            <td style="width: 300px;text-align: right;">我的简介</td>
            <td style="width: 600px">
            <textarea name="我的简介"  cols="30" rows="10"></textarea>
            </td>
        </tr>
        <tr>
            <td colspan="2" style="padding-left: 40%;"><input type="submit" value="提交" ></td>
            
        </tr>
    </table>
</form>
</div>


<script type="text/javascript">
    function checkpassword() {
        var password = document.getElementById("pw").value;
        var repassword = document.getElementById("repw").value;
        
        if(password == repassword) {
             document.getElementById("tishi").innerHTML="<br><font color='green'>两次密码输入一致</font>";
             document.getElementById("submit").disabled = false;
            
         }else {
             document.getElementById("tishi").innerHTML="<br><font color='red'>两次输入密码不一致!</font>";
             document.getElementById("submit").disabled = true; 
         } 
    }
</script>


</body>
</html>